<template>
  <div>
    <!-- 头部 -->
    <van-row class="heads">
      <van-icon name="arrow-left" @click="back" class="back" />
      <span> 设置 </span>
    </van-row>
    <!-- 个人 -->
    <van-row class="users">
      <van-col span="3" offset="1">
        <van-image
          round
          width="2.8125rem"
          height="2.8125rem"
          src="https://img01.yzcdn.cn/vant/cat.jpeg"
        />
      </van-col>
      <van-col span="5" offset="1">
        <span>水果项目</span>
        <br />
        <span class="littlesize">商品名：黑店</span>
      </van-col>
      <van-col offset="6" class="buttoncenter">
        <van-button type="default" size="small" to= 'setting/editmessge' >编辑基本信息</van-button>
      </van-col>
    </van-row>
    <!-- 下面选项 -->
    <van-row>
      <van-cell is-link title="账号安全" class="options" to='setting/accountsecurity' />
      <van-cell is-link title="系统权限" class="options" />
      <van-cell is-link title="隐私政策" class="options" />
      <van-cell is-link title="问题反馈" class="options"  to='/setting/feedback' />
      <van-cell is-link title="清除缓存" class="options" />
      <van-cell is-link title="平台介绍" class="options" />
      <van-cell is-link title="系统更新" class="options" @click="show = true" />
      <van-overlay :show="show" @click="show = false">
        <div class="wrapper" >
          <div class="block">已是最新版本</div>
        </div>
      </van-overlay>
    </van-row>
    <van-row>
      <van-col offset="8" span="8" class="out">
        <van-button type="default" size="normal" to>退出登陆</van-button>
      </van-col>
    </van-row>
  </div>
</template>

<script>
export default {
  name: "Setting",
  data() {
    return {
      show: false,
    };
  },

  mounted() {},

  methods: {
    back() {
      this.$router.go(-1);
    },
  },
};
</script>

<style  scoped>
.back {
  cursor: pointer;
}
.heads {
  font-size: 18px;
  font-weight: bold;
  /* line-height: 2.375rem; */
  color: white;
  background-color: rgb(0, 255, 170);
  height: 2.375rem;
  padding: 0.9375rem 0.1875rem 0rem 0.625rem;
}

.users {
  padding: 0.3125rem 0rem;
  /* text-align: center; */
  height: 3.125rem;
  border-bottom: solid 1px rgb(211, 209, 209);
}
.littlesize {
  font-size: 0.75rem;
  font-weight: lighter;
  text-align: center;
  margin-top: 0.3125rem;
}
.buttoncenter {
  line-height: 2.1875rem;
}
/* .options{
    font-size: 20px;
    height: 50px;
    line-height: 50px;
} */
.out {
  text-align: center;
}

.wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  background-color: rgba(243, 239, 239, 0.2);
}

.block {
  width: 85px;
  height: 20px;
  font-size: 14px;
  background-color: rgb(56, 54, 54);
}
</style>